import * as echarts from 'echarts';
const levelBar = (data, unit = "") => {
  let option = {
    grid: {
      left: "0%",
      right: "0%",
      bottom: "0%",
      top: "0%",
      containLabel: true,
    },
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "none",
      },
      formatter: function (params) {
        return (
          params[0].name +
          "<br/>" +
          "<span style='display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:rgba(36,207,233,0.9)'></span>" +
          params[0].seriesName +
          " : " + params[0].value
        );
      },
    },
    xAxis: {
      show: false,
      type: "value",
    },
    yAxis: [
      {
        type: "category",
        inverse: true,
        axisLabel: {
          show: true,
          textStyle: {
            color: "#fff",
          },
        },
        splitLine: {
          show: false,
        },
        axisTick: {
          show: false,
        },
        axisLine: {
          show: false,
        },
        data: data.data.map(obj => { return obj.city }),
      },
      {
        type: "category",
        inverse: true,
        axisTick: "none",
        axisLine: "none",
        show: true,
        axisLabel: {
          textStyle: {
            color: "#ffffff",
            fontSize: "12",
          },
          formatter: function (value) {
            if (value >= 10000) {
              return (value / 10000).toLocaleString() + "万";
            } else {
              return value.toLocaleString();
            }
          },
        },
        data: data.data.map(obj => { return obj.number }),
      },
    ],
    series: [
      {
        name: unit,
        type: "bar",
        barGap: '200%',
        zlevel: 1,
        itemStyle: {
          normal: {
            barBorderRadius: [0, 0, 100, 0],
            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
              {
                offset: 0,
                color: data.color[0],
              },
              {
                offset: 1,
                color: data.color[1],
              },
            ]),
          },
        },
        barWidth: 10,
        data: data.data.map(obj => { return obj.number }),
      },
      {
        name: "背景",
        type: "bar",
        barWidth: 10,
        barGap: "-100%",
        data: [20, 20, 20, 20, 20],
        itemStyle: {
          normal: {
            color: "rgba(24,31,68,1)",
            barBorderRadius: 0
          },
        },
      },
    ],
  };
  const opt = Object.assign({}, option);
  return opt;

}

export default {
  levelBar
}
